<template>
	<view>
		<view class="list">
			<ul @click="popUp">
				<li class="li1">绑定手机号</li>
				<!-- <li class="li2" v-if="authPhone != ''">{{ authPhone | testfile }}</li> -->

				<li class="li2" v-if="sjh != ''">{{sjh}}</li>


				<!-- appletsBindPhone -->


				<li class="li3">
					<image :src="$BASE_URL + '/st/mini/static/img/mine/right.png'" mode="" class="rightImg"></image>
				</li>
			</ul>
			<ul @click="goPath('../officialAccounts/officialAccounts')">
				<li class="li1">绑定公众号</li>
				<li class="li2"></li>
				<li class="li3">
					<image :src="$BASE_URL + '/st/mini/static/img/mine/right.png'" mode="" class="rightImg"></image>
				</li>
			</ul>
		</view>
		<view class="login" @click="exit"> 退出登录 </view>
	</view>
</template>

<script>
	import Vue from "vue";
	import {
		decrypt
	} from "@/commons/util.des.js";
	export default {
		data() {
			return {
				$BASE_URL: this.$BASE_URL,
				authPhone: "",
				downloadUrl: "",
				sjh: "",

			};
		},
		// 数字中间加*号 value是传的参数值(后端返回的，需要你处理的数据)
		// 	filters: {

		// 		testfile(value) {
		// 			 
		// 			const start = value.slice(0, 3);
		// 			const end = value.slice(-4);

		// 			return `${start}****${end}`;
		// 		},
		// 	},
		onShow() {
			var that = this;
			if (uni.getSystemInfoSync().platform == "android") {
				this.getAppDownloadUrl("android");
			} else {
				this.getAppDownloadUrl("ios");
			}
			uni.getStorage({
				key: "userInfo",
				success: function(res) {

					var appletsBindPhone = res.data.appletsBindPhone
					//  
					if (appletsBindPhone) {
						var shoujihao = appletsBindPhone

					} else {
						var authPhone = decrypt(res.data.authPhone);

						var shoujihao = authPhone

					}





					const start = shoujihao.slice(0, 3);
					const end = shoujihao.slice(-4);
					that.sjh = `${start}****${end}`;



				},
			});
		},
		methods: {





			getAppDownloadUrl(clientType) {
				var data = {
					url: "/web/v2/api/newApi/app/getAppDownloadUrl",
					methods: "post",
					data: {
						clientType: clientType,
					},
				};
				this.$http(data).then((res) => {
					this.downloadUrl = res.data.data.url;
				});
			},
			exit() {
				// 清空本地消息缓存
				getApp().globalData = {
					sessions: [],
					set: 1,
					huihua: []
				}
				uni.redirectTo({
					url: "/pages/login/wxlogin",
				});
				//清除本地登录状态
				// uni.clearStorage();
				//IM实例销毁
				Vue.prototype.$NIM.disconnect();
			},
			goPath(path) {
				uni.navigateTo({
					url: path,
				});
			},

			copy(value) {
				uni.setClipboardData({
					data: value, //要被复制的内容
					success: function() {
						//重点~做笔记
						//在success中加入uni.hideToast()可以解决
						uni.showToast({
							title: '复制成功',
							duration: 2000,
							icon: 'none'
						});
						//以下就可自定义操作了~
					},
					fail: function(err) {
						uni.showToast({
							title: '复制失败',
							duration: 2000,
							icon: 'none'
						});
					}
				});
			},
			popUp() {
				uni.showModal({
					title: "下载“哩咔”APP体验更多精彩内容",
					content: this.downloadUrl + "\n复制地址到浏览器下载",
					confirmText: "一键复制", // 确认按钮文字
					showCancel: true, // 是否显示取消按钮，默认为 true
					success: (res) => {
						if (res.confirm) {
							this.copy(this.downloadUrl);
						} else {
							console.log("else", res);
						}
					},
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.list {
		width: 714upx;
		margin: 0 auto;
		background: #ffffff;
		border-radius: 42upx;
		padding: 14upx 0;

		ul {
			display: flex;
			width: calc(100% - 46upx);
			height: 92upx;
			align-items: center;
			padding: 0 23upx;

			.li2 {
				margin-right: 30upx;
				flex: 1;
				text-align: right;
			}

			.li3 {
				margin-left: auto;
			}

			.rightImg {
				width: 25upx;
				height: 25upx;
			}
		}
	}

	.login {
		width: 460upx;
		height: 88upx;
		line-height: 88upx;
		background-image: linear-gradient(90deg, #642afd 0%, #bc43ff 100%),
			linear-gradient(#ffffff, #ffffff);
		background-blend-mode: normal, normal;
		box-shadow: 0px 4upx 18upx 0upx rgba(78, 15, 232, 0.47);
		border-radius: 44upx;
		font-size: 30upx;
		font-weight: bold;
		text-align: center;
		color: #ffffff;
		margin: 0 auto;
		margin-top: 230upx;
	}
</style>
